<!DOCTYPE html>
<html>

	<head>
		<meta charset="utf-8">
		<meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no" />
		<title>APP</title>
		<link href="css/weui.min.css" rel="stylesheet" />
		<link href="css/jquery-weui.min.css" rel="stylesheet" />
		<link href="css/style.css" rel="stylesheet" />
		<link href="fonts/iconfont.css" rel="stylesheet" />
		<link href="css/flex.css" rel="stylesheet" />
		<script src="js/immersed.js"></script>
	</head>

	<style>
		.main-body {
			background-color: #f4f4f4;
		}
		
		.weui-cell {
			font-size: 15px;
		}
		
		.weui-label {
			width: 100px;
		}
	</style>

	<body>

		<div id="app">
			<form id="form" v-on:submit.prevent>

				<div class="xiaoyi-header header-red" id="header">
					<div class="xiaoyi-header-left"><i class="iconfont icon-back" onclick="wsClose()"></i></div>
					<div class="xiaoyi-header-title">资料修改
					</div>
					<!--<div class="xiaoyi-header-right"><span style="margin: 10px 10px 0 0 ; display: block;" @click="onSubmit">搜索</span></div>-->
				</div>

				<div class="main-body" id="main">

					<input type="hidden" name="id" :value="userinfo.id">

					<div class="weui-cells">
						<a class="weui-cell weui-cell_access select-pic" href="javascript:;">
							<div class="weui-cell__hd">
								<img class="usericon" :src="userinfo.icon_img+'@!200x200'" style="width: 60px; border-radius: 50%;" v-if="userinfo.icon_img">
								<img class="usericon" src="images/no-touxiang.png" style="width: 60px; border-radius: 50%;" v-else>
								<input type="hidden" name="icon" :value="userinfo.icon">
							</div>
							<div class="weui-cell__bd">
							</div>
							<div class="weui-cell__ft">修改头像</div>
						</a>
					</div>

					<div class="weui-cells weui-cells_form">

						<div class="weui-cell">
							<div class="weui-cell__hd"><label class="weui-label">姓名</label></div>
							<div class="weui-cell__bd">
								<input class="weui-input" type="text" name="real_name" placeholder="请输入姓名" :value="userinfo.real_name">
							</div>
						</div>

						<div class="weui-cell">
							<div class="weui-cell__hd"><label class="weui-label">手机</label></div>
							<div class="weui-cell__bd">
								<input class="weui-input" type="text" name="phone" :value="userinfo.phone" disabled="disabled">
							</div>
						</div>

						<div class="weui-cell">
							<div class="weui-cell__hd"><label class="weui-label">合伙人编号</label></div>
							<div class="weui-cell__bd">
								<input class="weui-input" type="text" name="agent_sn" :value="userinfo.agent_sn" disabled="disabled">
							</div>
						</div>

						<div class="weui-cell">
							<div class="weui-cell__hd"><label class="weui-label">保证金</label></div>
							<div class="weui-cell__bd">
								<input class="weui-input" type="text" name="bond" :value="userinfo.bond" disabled="disabled">
							</div>
						</div>

						<div class="weui-cell">
							<div class="weui-cell__hd"><label class="weui-label">微信</label></div>
							<div class="weui-cell__bd">
								<input class="weui-input" type="text" name="weixin" placeholder="请输入微信" :value="userinfo.weixin">
							</div>
						</div>

						<div class="weui-cell">
							<div class="weui-cell__hd"><label class="weui-label">QQ</label></div>
							<div class="weui-cell__bd">
								<input class="weui-input" type="text" name="qq" placeholder="请输入QQ" :value="userinfo.qq">
							</div>
						</div>

						<div class="weui-cell">
							<div class="weui-cell__hd"><label class="weui-label">Email</label></div>
							<div class="weui-cell__bd">
								<input class="weui-input" type="text" name="email" placeholder="请输入Email" :value="userinfo.email">
							</div>
						</div>

					</div>
					
					<div class="weui-cells">
					  <a class="weui-cell weui-cell_access" href="javascript:;" onclick="clicked('my_password.html','pop-in')">
					    <div class="weui-cell__bd">
					      <p>修改密码</p>
					    </div>
					    <div class="weui-cell__ft">
					    </div>
					  </a>
					</div>
					
					<div class="weui-btn-area">
						<button type="submit" @click="onSubmit" class="weui-btn weui-btn_primary">提 交</button>
					</div>

				</div>

			</form>
		</div>

		<script src="js/mui.min.js"></script>
		<script src="js/jquery-2.1.4.js"></script>
		<script src="js/jquery-weui.min.js"></script>
		<script src="js/vue.js"></script>
		<script src="js/smarge.js"></script>
		<script src="js/common.js"></script>
		<script type="text/javascript" charset="utf-8">
			mui.init();

			mui.plusReady(function() {

				var vm = new Vue({
					el: "#app",
					data: {
						userinfo: ''
					},
					mounted: function() {
						this.inits()
					},
					methods: {
						inits: function() {
							var vm = this;
							vm.userinfo = getUserInfo();
						},
						onSubmit: function() {
							var _data = fromToJson("form");
							plus.nativeUI.showWaiting()
							Post(SERVER_URL+"&c=User&a=setInfo",_data,function(data){ 
									if(data.status){
										Get(SERVER_URL+'&c=User&a=getInfo', {}, function(data) {
							            	if(data.status){
							            		Smarge.set('userinfo', data.info);
							            		vm.userinfo = data.info;
							            		plus.nativeUI.closeWaiting();
							            		mui.toast('修改成功');
							            		plus.webview.getWebviewById('my').evalJS("updateData()");
												wsClose();
							            	}
							            })
									}else{
										mui.alert(data.info)
									}
							})
						}
					}
				});

			});

			var serverurl = SERVER_URL + '&c=Public&a=ajaxUploadPicture&path=user_icon';

			mui(document).on('tap', '.select-pic', function(e) {
				//alertHTML(updateData);
				var btnArray = [{
					title: "从相册选择"
				}, {
					title: "拍照"
				}];
				plus.nativeUI.actionSheet({
					title: "上传头像",
					cancel: "取消",
					buttons: btnArray
				}, function(e) {
					var index = e.index;
					switch(index) {
						case 0:
							break;
						case 1:
							appendByGallery();
							break;
						case 2:
							appendByCamera();
							break;
						default:
							// 其它
							break;
					}
				});
			});

			// 拍照添加文件
			function appendByCamera() {
				plus.camera.getCamera().captureImage(function(p) {
					var wt = plus.nativeUI.showWaiting('正在上传...');
					var task = plus.uploader.createUpload(serverurl, {
							method: "POST"
						},
						function(t, status) { //上传完成
							if(status == 200) {
								var _path = JSON.parse(t.responseText).data.jushifile.path;
								var _id = JSON.parse(t.responseText).data.jushifile.id;
								var _imgSrc = 'https://imgcdn.jushiyunku.com/' + _path + '@!200x200';
								addImage(_imgSrc,_id);
								wt.close();
							} else {
								mui.toast("上传失败：" + status);
								wt.close();
							}
						}
					);
					task.addData("client","jushiyunku");
					task.addData("uid",getUid());
					task.addFile(e.files[i],{key:'jushifile'});
					task.start();
				});
			}

			// 从相册中选择图片
			function appendByGallery() {

				plus.gallery.pick(function(e) {
					var i = 0;
					var length = e.files.length;
					var wt = plus.nativeUI.showWaiting('正在上传 1/' + length);

					function upload() {
						var task = plus.uploader.createUpload(serverurl, {
								method: "POST"
							},
							function(t, status) { //上传完成
								if(status == 200) {
									log(JSON.parse(t.responseText))
									var _path = JSON.parse(t.responseText).data.jushifile.path;
									var _id = JSON.parse(t.responseText).data.jushifile.id;
									var _imgSrc = 'https://imgcdn.jushiyunku.com/' + _path+ '@!200x200';
									addImage(_imgSrc,_id);
									i++;
									if(i < length) {
										upload();
									} else {
										wt.close();
									}
									wt.setTitle('正在上传 ' + i + '/' + length)
								} else {
									mui.toast("上传失败：" + status);
									wt.close();
								}
							}
						);
						task.addData("client","jushiyunku");
						task.addData("uid",getUid());
						task.addFile(e.files[i],{key:'jushifile'});
						task.start();
					}
					upload();

				}, function(e) {
					mui.toast("取消选择");
				}, {
					filter: "image",
					multiple: true,
					maximum: 1,
					system: false,
					onmaxed: function() {
						plus.nativeUI.alert('一次最多只能选择1张图片，如果图片较多请分多次选择！');
					}
				});
			}

			// 产生一个随机数
			function getSid() {
				return Math.floor(Math.random() * 100000000 + 10000000).toString();
			}

			function addImage(imgurl,id) {
				//alert(imgurl+"------------"+id)
				$(".usericon").attr('src',imgurl);
				$('input[name=icon]').val(id);
				mui.toast('上传成功，正在更新！')
			}
		</script>
	</body>

</html>